<template>
  <div class="input-wrapper">
      <i-input value="张三"></i-input>
      <i-input value="李四" disabled></i-input>
      <i-input value="王五" readonly></i-input>
      <i-input value="王" error="姓名不能少于两个字"></i-input>
      <br>
      <i-input v-model="message"></i-input>
      <p>双向绑定:&nbsp;{{message}}</p>
      <button @click="message +=1">+1</button>
  </div>
</template>

<script>
import Input from '../../../src/input'

export default {
  components: { 'i-input': Input },
  data(){
    return{ message: '你好！' }
  }
}
</script>

<style lang="scss" scoped>
 @import "../styles/helper";

 .input-wrapper {
    padding-top: $wrapper-top;
 }
</style>